﻿<div>
    <CheckboxGroup Style="width:100%"
                   Options="@plainOptions"
                   OnChange="OnChange"
                   Value="@(new[]{"B", "Pear"})"
                   MixedMode="mixedMode">
        <Row>
            <Col Span="8">
            <Checkbox Label="Banana">Banana</Checkbox>
            </Col>
            <Col Span="8">
            <Checkbox Label="Kiwi">Kiwi</Checkbox>
            </Col>
        </Row>
    </CheckboxGroup>

    <br /><br />
    <Button Type="@ButtonType.Primary" OnClick="ChangeMode">Toggle MixedMode</Button>
</div>
@using System.Text.Json
@code {
    string[] plainOptions = { "Apple", "Pear", "Orange" };
    CheckboxGroupMixedMode mixedMode = CheckboxGroupMixedMode.ChildContentFirst;

    void OnChange(string[] checkedValues)
    {
        Console.WriteLine($"checked = {JsonSerializer.Serialize(checkedValues)}");
    }

    void ChangeMode()
    {
        mixedMode = mixedMode == CheckboxGroupMixedMode.ChildContentFirst ? CheckboxGroupMixedMode.OptionsFirst : CheckboxGroupMixedMode.ChildContentFirst;
    }
}